Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

perf(@angular-devkit/build-angular): inject Sass import/use directive importer information when resolving #25534

Merged
merged 1 commit into from
Jul 14, 2023

Conversation

clydin
Copy link
Member

@clydin clydin commented Jul 12, 2023

To correctly resolve a package based import reference in a Sass file with pnpm or Yarn PnP, the importer file path must be known. Unfortunately, the Sass compiler does not provided the importer file to import plugins. Previously to workaround this issue, all previously resolved stylesheets were tried as the importer path. This allowed the stylesheets to be resolved but it also could cause a potentially large increase in build time due to the amount of previous stylesheets that would need to be tried. To avoid the performance impact and to also provide more accurate information regarding the importer file, a lexer is now used to extract import information for a stylesheet and inject the importer file path into the specifier. This information is then extracted from the import specifier during the Sass resolution process and allows the underlying package resolution access to a viable location to resolve the package for all package managers. This information is currently limited to specifiers referencing the @angular and @material package scopes but a comprehensive pre-resolution process may be added in the future.

@clydin clydin added the target: minor This PR is targeted for the next minor release label Jul 12, 2023
@clydin clydin marked this pull request as ready for review July 13, 2023 01:51
@clydin clydin added the action: review The PR is still awaiting reviews from at least one requested reviewer label Jul 13, 2023
@clydin clydin requested a review from dgp1130 July 13, 2023 21:08
Copy link
Collaborator

@dgp1130 dgp1130 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do we have any existing unit tests for this functionality we should be updating as well? Or is the existing integration test suite sufficient for this change, given that it's a performance optimization which shouldn't observably change anything?

@clydin clydin force-pushed the sass/import-use-lexer branch 2 times, most recently from e57753a to 320e5fc Compare July 14, 2023 13:17
… importer information when resolving

To correctly resolve a package based import reference in a Sass file with pnpm or Yarn PnP, the importer
file path must be known. Unfortunately, the Sass compiler does not provided the importer file to import plugins.
Previously to workaround this issue, all previously resolved stylesheets were tried as the importer path. This
allowed the stylesheets to be resolved but it also could cause a potentially large increase in build time due
to the amount of previous stylesheets that would need to be tried. To avoid the performance impact and to also
provide more accurate information regarding the importer file, a lexer is now used to extract import information
for a stylesheet and inject the importer file path into the specifier. This information is then extracted from the
import specifier during the Sass resolution process and allows the underlying package resolution access to a viable
location to resolve the package for all package managers. This information is currently limited to specifiers
referencing the `@angular` and `@material` package scopes but a comprehensive pre-resolution process may be added
in the future.
@clydin clydin added action: merge The PR is ready for merge by the caretaker and removed action: review The PR is still awaiting reviews from at least one requested reviewer labels Jul 14, 2023
@clydin clydin merged commit 61a652d into angular:main Jul 14, 2023
21 checks passed
@clydin clydin deleted the sass/import-use-lexer branch July 14, 2023 23:03
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Aug 14, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
action: merge The PR is ready for merge by the caretaker target: minor This PR is targeted for the next minor release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants